<!--
 * @Description: 
 * @Author: lijiajin
 * @Date: 2020-07-06 09:04:53
 * @LastEditTime: 2020-07-06 13:40:28
 * @LastEditors: lijiajin
 -->
<!DOCTYPE html>
<html lang="en" xmlns:width="http://www.w3.org/1999/xhtml">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta name="format-detection" content="telephone=no,email=no,address=no">
    <title>网站管理</title>
    <link rel="stylesheet" href="./icon/iconfont.css">
    <link rel="stylesheet" href="./plugins/layui/css/layui.css">
    <link rel="stylesheet" href="./css/nanoscroller.css">
    <link rel="stylesheet" href="./plugins/jquery-ui/jquery-ui.min.css">
    <link rel="stylesheet" href="./css/common.css">
    <link rel="stylesheet" href="./css/style.css">
    <script src="./js/JQuery2.1.4.js"></script>
    <script src="./plugins/layui/layui.js"></script>
    <script src="./js/spin.min.js"></script>
    <script src="./js/loading.js"></script>

</head>

<body>
<div class="wrap-box">
    <p class="title-h1"><a href="./web-manage-inside-banner.html">内页Banner</a><span>/</span><span>添加内页Banner</span></p>
    <div class="language-exchange">
        <div>
            <a data-id="1" class="language-btn active" href="javascript:;">英语</a>
            <a data-id="2" class="language-btn" href="javascript:;">法语</a>
            <a data-id="3" class="language-btn" href="javascript:;">日语</a>
        </div>
    </div>
    <div class="content-scroll-box content-scroll-box3 content-scroll-box-border nano">
        <form class="content-scroll nano-content ajax-form" onsubmit="return false;">
            <div class="item-box no-pdt" data-checkCheckbox="true" data-checkCheckboxNum="1" data-checkCheckboxText="请至少选择一个导航">
                <p class="item-title">导航名称<span class="xing">*</span></p>
                <div class="item">
                    <div class="item-checkbox-border max-width-limit760">
                        <div class="check-box-div">
                            <a href="javascript;:" class="icon iconfont iconduoxuanweixuanzhong"><input
                                    class="checkbox-input" type="checkbox" name="checkbox" value="1"/></a>
                            <span class="text">Products</span>
                        </div>
                        <div class="check-box-div">
                            <a href="javascript;:" class="icon iconfont iconduoxuanweixuanzhong"><input
                                    class="checkbox-input" type="checkbox" name="checkbox" value="2"/></a>
                            <span class="text">News</span>
                        </div>
                        <div class="check-box-div">
                            <a href="javascript;:" class="icon iconfont iconduoxuanweixuanzhong"><input
                                    class="checkbox-input" type="checkbox" name="checkbox" value="3"/></a>
                            <span class="text">Contact us</span>
                        </div>
                        <div class="check-box-div">
                            <a href="javascript;:" class="icon iconfont iconduoxuanweixuanzhong"><input
                                    class="checkbox-input" type="checkbox" name="checkbox" value="3"/></a>
                            <span class="text">About us</span>
                        </div>
                    </div>
                </div>
            </div>
            <div class="item-multiple sortable">
                <p class="item-title">Banner图<span class="xing">*</span><span>（建议：图片尺寸1920X534px，图片质量大小不超过200KB）</span></p>
                <div class="item-cell-box item-cell-box-banner">
                    <div class="fl">
                        <div class="item-box">
                            <div class="item mgt15">
                                <div class="bank-pic-list-box banner-box">
                                    <ul class="bank-pic-list" data-maxNum="1" data-necessary="true" data-minNum="1">
                                        <li class="pic-item add-pic-btn" onclick="showPicBankDialog(this)"></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="fl info">

                        <div class="item-box" data-translate="true" data-id="1">
                            <p class="item-title">图片标题</p>
                            <div class="item">
                                <p class="input">
                                    <input type="text"
                                           class="check-input"
                                           name="[]"
                                           maxlength="110"
                                           data-length="110"
                                           data-lengthText="图片标题不能超过110字符"/>
                                </p>
                            </div>
                        </div>
                        <div class="item-box" data-translate="true" data-id="2" style="display: none;">
                            <p class="item-title">图片标题</p>
                            <div class="item">
                                <p class="input">
                                    <input type="text"
                                           class="check-input"
                                           name="[]"
                                           data-length="255"
                                           data-lengthText="图片标题不能超过255字符"/>
                                </p>
                            </div>
                        </div>
                        <div class="item-box" data-translate="true" data-id="3" style="display: none;">
                            <p class="item-title">图片标题</p>
                            <div class="item">
                                <p class="input">
                                    <input type="text"
                                           class="check-input"
                                           name="[]"
                                           data-length="255"
                                           data-lengthText="图片标题不能超过255字符"/>
                                </p>
                            </div>
                        </div>

                        <div class="item-box" data-translate="true" data-id="1">
                            <p class="item-title">alt属性</p>
                            <div class="item">
                                <p class="input">
                                    <input type="text"
                                           class="check-input"
                                           name="[]"
                                           maxlength="110"
                                           data-length="110"
                                           data-lengthText="alt属性不能超过110字符"/>
                                </p>
                            </div>
                        </div>
                        <div class="item-box" data-translate="true" data-id="2" style="display: none;">
                            <p class="item-title">alt属性</p>
                            <div class="item">
                                <p class="input">
                                    <input type="text"
                                           class="check-input"
                                           name="[]"
                                           data-length="255"
                                           data-lengthText="alt属性不能超过255字符"/>
                                </p>
                            </div>
                        </div>
                        <div class="item-box" data-translate="true" data-id="3" style="display: none;">
                            <p class="item-title">alt属性</p>
                            <div class="item">
                                <p class="input">
                                    <input type="text"
                                           class="check-input"
                                           name="[]"
                                           data-length="255"
                                           data-lengthText="alt属性不能超过255字符"/>
                                </p>
                            </div>
                        </div>

                        <div class="item-box">
                            <p class="item-title">链接</p>
                            <div class="item">
                                <p class="input">
                                    <input type="text"
                                           class="check-input"
                                           name="[]"
                                           data-url="请输入符合要求的链接"
                                           maxlength="200"
                                           data-length="200"
                                           data-lengthText="链接不能超过200字符"/>
                                </p>
                            </div>
                        </div>
                    </div>
                    <div class="i-btn">
                        <a href="javascript:;" class="icon iconfont icontuodong"></a>
                        <a href="javascript:;" class="icon iconfont iconshanchuanniu delete-banner-item-btn" onclick="deleteBannerItem(this)"></a>
                    </div>
                    <div class="clear"></div>
                </div>
                <div class="item-box" style="margin-top: 30px">
                    <a href="javascript:;"
                       class="layui-btn layui-btn-primary-blue icon iconfont iconhao add-banner-item-btn"
                       data-empty="请至少上传一张Banner图"
                       data-el="">添加Banner图</a>
                </div>
            </div>
            <div class="item-box item-btn">
                <button type="submit" class="layui-btn ajax-form-commit">保存</button>
                <button type="button" class="layui-btn layui-btn-primary-blue ajax-form-translate">翻译</button>
                <a href="./web-manage-inside-banner.html" class="layui-btn layui-btn-primary-blue">返回</a>
            </div>
        </form>
    </div>
</div>

<script src="./js/echarts.min.js"></script>
<script src="./js/jquery.nanoscroller.js"></script>
<script src="./plugins/jquery-ui/jquery-ui.min.js"></script>
<script src="./js/check.js"></script>
<script src="./js/common.js"></script>
<script src="./js/form-commit.js"></script>
<script>
    $(function() {
        $(".sortable").sortable({
            cursor: "move",
            items: ".item-cell-box-banner", //只是tr可以拖动
            opacity: 0.6, //拖动时，透明度为0.6
            revert: false, //释放时，增加动画
            update: function(event, ui) { //更新排序之后
                var categoryids = $(this).sortable("toArray");
                var $this = $(this);

            }
        });
        $(".sortable").disableSelection();
    });
</script>
</body>

</html>